<template>
  <div class="con">
        <!-- 充值提现 -->
        <div class="contbox6_10">
          <p class="titlelist6_10">
            账户管理
            <span style="color: #999;">&nbsp;&nbsp;/&nbsp;&nbsp;</span>分润明细
          </p>
          <div class="content">
          <div class="sousuojg6_10">
            <el-form :model="formInline" class="demo-form-inline" label-width="100px">
              <el-form-item label="归属机构">
                <el-input v-model="officeName" readonly  @focus="selectInstitution" placeholder="请输入归属机构"></el-input>
              </el-form-item>
              <el-form-item label="机构类型" v-if="jurisdiction==2">
                <el-select v-model="formInline.agtType" clearable placeholder="请选择">
                  <el-option label="普通代理" value="1"></el-option>
              <el-option label="OEM" value="0"></el-option>
              <el-option label="渠道机构" value="3"></el-option>
              <!--<el-option label="权益购买分润 " value="3"></el-option>
              <el-option label="激活返现分润" value="4"></el-option>
                  <el-option label="达标分润" value="5"></el-option>-->
                </el-select>
              </el-form-item>
              <el-form-item label="归属OEM">
                <el-input v-model="formInline.oemName" placeholder="请输入归属OEM"></el-input>
              </el-form-item>
              <el-form-item label="机构名称">
                <el-input v-model="formInline.officeName" placeholder="请输入机构名称"></el-input>
              </el-form-item>
              <el-form-item label="分润订单号">
                <el-input v-model="formInline.orderCode" placeholder="请输入分润订单号"></el-input>
              </el-form-item>
              <el-form-item label="分润类型">
                <el-select v-model="formInline.earnType" clearable placeholder="请选择">
                  <!-- <el-option label="全部" value=""></el-option>
                  <el-option label="商户交易分润" value="1"></el-option>
                  <el-option label="购机分润" value="2"></el-option> -->
                  <el-option label="权益购买分润" value="3"></el-option>
                  <el-option label="网申办卡分润" value="12"></el-option>
                  <!-- <el-option label="激活返现分润" value="4"></el-option>
                  <el-option label="达标分润" value="5"></el-option>
                  <el-option label="排名奖励活动分润" value="6"></el-option>
                  <el-option label="伙伴拉新活动分润" value="7"></el-option>
                  <el-option label="商户拉新活动分润" value="8"></el-option>
                  <el-option label="定时达标活动分润" value="9"></el-option>
                  <el-option label="周期达标活动分润" value="10"></el-option>
                  <el-option label="次月达标活动分润" value="11"></el-option> -->
                </el-select>
              </el-form-item>
              <el-form-item label="入账状态">
                <el-select v-model="formInline.status" clearable placeholder="请选择">
                  <el-option label="全部" value=""></el-option>
                  <el-option label="未入账" value="1"></el-option>
                  <!-- <el-option label="冻结收益" value="2"></el-option> -->
                  <el-option label="已入账" value="0"></el-option>
                </el-select>
              </el-form-item>
              <el-form-item label="订单日期">
                <el-date-picker
                  v-model="dataTime"
                  type="daterange"
                  range-separator="至"
                  start-placeholder="开始日期"
                  end-placeholder="结束日期"
                  value-format="yyyy-MM-dd"
                ></el-date-picker>
              </el-form-item>
            </el-form>
          </div>
          <div class="buttons">
            <el-button
            v-if="isAuth('adminFenRunSearch')"
              type="primary"
              style="margin-right:10px"
              @click="queryPayActiveLists"
            >搜索</el-button>
            <el-button
              v-if="isAuth('adminFenRunReset')"
                  @click="reset"
                >重置</el-button>
                <el-button v-if="totalNum>0" @click="payActiveListExport" type="primary" class="butt" style="margin-left:40px">批量导出</el-button>
          </div>
          <el-table
            :data="tableData"
            ref="multipleTable"
            :header-cell-style="{ background: '#F9FAFC', color: '#222' }"
                stripe
                border
                :row-style="{ height: '0px' }"
                :cell-style="{ padding: '0px' }"
                style="margin-top: 24px !important;"
            :v-loading="listLoading"
          >
            <!-- <el-table-column type="selection" min-width="40"></el-table-column> -->
             <el-table-column show-overflow-tooltip prop="toOfficeName" min-width="160" label="归属机构"></el-table-column>
            <el-table-column show-overflow-tooltip prop="oemName" min-width="160" label="归属OEM"></el-table-column>
            <el-table-column show-overflow-tooltip prop="officeUid" min-width="180" label="机构ID"></el-table-column>
            <el-table-column show-overflow-tooltip prop="officeName" min-width="160" label="机构名称"></el-table-column>
            <el-table-column show-overflow-tooltip min-width="80" label="机构类型">
              <template slot-scope="scope">
                <span v-if="scope.row.agtType == 1">普通代理</span>
                <span v-if="scope.row.agtType == 0">OEM代理</span>
                <span v-if="scope.row.agtType == 3">渠道机构</span>
              </template>
            </el-table-column>
            <el-table-column show-overflow-tooltip prop="createDate" min-width="160" label="订单日期"></el-table-column>
            <el-table-column show-overflow-tooltip prop="actualAmount" min-width="120" label="订单金额（元）"></el-table-column>
            <el-table-column show-overflow-tooltip prop="profitAmt" min-width="120" label="分润金额（元）"></el-table-column>
            <el-table-column show-overflow-tooltip prop="orderCode" min-width="200" label="分润订单号"></el-table-column>
            <el-table-column min-width="140" label="分润类型">
              <template slot-scope="scope">
                <!-- <span v-if="scope.row.earnType == 1">商户交易分润</span>
                <span v-if="scope.row.earnType == 2">购机分润</span> -->
                <span v-if="scope.row.earnType == 3">权益购买分润</span>
                <span v-if="scope.row.earnType == 12">网申办卡分润</span>
                <!-- <span v-if="scope.row.earnType == 4">激活返现分润</span>
                <span v-if="scope.row.earnType == 5">达标分润</span>
                <span v-if="scope.row.earnType == 6">排名奖励活动分润</span>
                <span v-if="scope.row.earnType == 7">伙伴拉新活动分润</span>
                <span v-if="scope.row.earnType == 8">商户拉新活动分润</span>
                <span v-if="scope.row.earnType == 9">定时达标活动分润</span>
                <span v-if="scope.row.earnType == 10">周期达标活动分润</span>
                <span v-if="scope.row.earnType == 11">次月达标活动分润</span> -->
              </template>
            </el-table-column>
            <el-table-column min-width="80" label="入账状态">
              <template slot-scope="scope">
                <span v-if="scope.row.status == 0">已入账</span>
                <span v-if="scope.row.status == 1">未入账</span>
                <!-- <span v-if="scope.row.status == 2">冻结收益</span> -->
              </template>
            </el-table-column>
          </el-table>
          
          <el-pagination
            background
            style="text-align: right;"
            class="pagination"
            @size-change="handleSizeChange"
            @current-change="handleCurrentChange"
            :current-page="formInline.page"
            :page-size="formInline.number"
            layout="total, sizes, prev, pager, next, jumper"
            :page-sizes="[20, 50, 100]"
            :total="totalNum"
          ></el-pagination>
        </div></div>

    <Tree :showType="showType"  @func="transmit" />
  </div>
</template>
<script type="text/ecmascript-6">
import bus from "../../assets/js/bus";
import https from "../../plugins/https.js";
import qs from "qs";
import Tree from "../tree/index"
// 批量导出
import { exportFile } from "../../plugins/expord"
export default {
  data() {
    return {
      showType:false,
      officeName:'',
      formInline: {
        oemName:"",
        oemUid: "",
        officeUid: "",
        orderCode: "",
        earnType: "",
        beginDate: "",
        status:"",
        endDate: "",
        page: 1,
        number: 20,
      },
      dialogTableData: [],
      dataTime: [],
      eventShow: false,
      machinesShow: false,
      listLoading: false,
      totalNum: 0, //总页数
      form: {},
      tableData: [],
      activityType: 1,
      activeUid: "",
      jurisdiction: "",
    };
  },
  components: {
    Tree
  },
  mounted() {
    this.queryPayActiveList();
    this.jurisdiction = localStorage.getItem("jurisdiction"); //判断当前用户 0-OEM  2-admin
    if(this.jurisdiction == 0){
      console.log("oem获取成功")
      this.formInline.oemUid = localStorage.getItem("uid")
    }
  },
  methods: {
    
    // 重置
    reset() {
      this.officeName = "";
      this.formInline.earnType = "";
      this.formInline.officeName = "";
      this.formInline.orderCode = "";
      this.formInline.earnType = "";
      this.formInline.oEMName = "";
      this.formInline.beginDate = "";
      this.formInline.endDate = "";
      this.formInline.officeUid = "";
      this.formInline.status = "";
       this.formInline.oemName = "";
      this.formInline.page=1
      this.mechanism = "";
      this.dataTime = [];
      this.queryPayActiveList();
    },
  //这里开始
    transmit(data){
      console.log(data.uid)
      //归属机构的uid
      this.formInline.officeUid = data.uid;
      //归属机构的名字
      this.officeName = data.name

    },
    //设置取消的
    determine(){
      // alert("执行")
      this.showType=false
    },

    selectInstitution(){
      this.showType=true
    },
    //这里结束





    queryPayActiveList() {
      this.listLoading = true;
      if (this.dataTime === null) this.dataTime = [];
      this.formInline.beginDate = this.dataTime[0];
      this.formInline.endDate = this.dataTime[1];
      https.queryEarnDetail(this.formInline).then((res) => {
        if (res.data.code !== "0000") {
          // this.$notify({ title: "错误", message: res.data.msg, type: "error" });
          layer.open({
              content: res.data.msg,
              skin: "msg",
              time:  2, //1秒后自动关闭
            });
          this.listLoading = false;
          return;
        }
        this.tableData = res.data.data;
        this.totalNum = res.data.total;
        this.listLoading = false;
      });
    },
    payActiveListExport() {
      // window.location.href = this.GLOBAL.httpurl + `/api/account/earnDetail/excel/export?${qs.stringify(this.formInline)}`;
      let that = this;
      exportFile("/api/account/earnDetail/excel/export",that.formInline,"分润明细")
      // that
      //   .axios({
      //     url: "api/account/earnDetail/excel/export",
      //     method: "POST",
      //     headers: { "Content-Type": "application/json;charset=utf-8" },
      //     data: that.formInline,
      //     responseType: "arraybuffer",
      //   })
      //   .then((res) => {
      //     let blob = new Blob([res.data], {
      //       type: "application/vnd.ms-excel;charset=utf-8",
      //     });
      //     var link = document.createElement("a");
      //     link.href = window.URL.createObjectURL(blob);
      //     let date = new Date();
      //     link.download =
      //       "分润明细列表" +
      //       date.getFullYear() +
      //       (date.getMonth() < 10 ? "0" + date.getMonth() : date.getMonth()) +
      //       (date.getDate() < 10 ? "0" + date.getDate() : date.getDate()) +
      //       (date.getHours() < 10 ? "0" + date.getHours() : date.getHours()) +
      //       (date.getMinutes() < 10
      //         ? "0" + date.getMinutes()
      //         : date.getMinutes()) +
      //       (date.getSeconds() < 10
      //         ? "0" + date.getSeconds()
      //         : date.getSeconds());
      //     link.click();
      //   })
      //   .catch((e) => {
      //   });
    },
    handleSizeChange(val) {
      this.formInline.number = val; //动态改变
      this.formInline.page = 1; //动态改变
      this.queryPayActiveList();
    },
    queryPayActiveLists(){
      this.formInline.page = 1; //动态改变
      this.queryPayActiveList();
    },
    handleCurrentChange(val) {
      this.formInline.page = val; //动态改变
      this.queryPayActiveList();
    },
  },
};
</script>
<style scoped>

.con{
  position: relative;
}
/* 单独样式 */
.contbox6_10 {
  width: 100%;
  /* margin-left: 2%;
  height: 87.5vh; */
  overflow-x: auto;
  box-sizing: border-box;
  float: left;
}
.elbtn {
  float: right;
  margin: 20px;
}
.img {
  display: block;
  width: 100%;
}
.money p {
  width: 100%;
  line-height: 30px;
}
.status {
  font-size: 14px;
  margin-bottom: 20px;
}
.color {
  color: #e6a23c;
}
.mt20 {
  margin-top: 20px;
}
.shopList {
  width: 100%;
  border-bottom: 1px solid #ccc;
  line-height: 80px;
  font-size: 16px;
}
.formItem {
  float: left;
}
.pagination {
  margin-top: 10px;
}
.btnExport {
  float: left;
  margin-left: 20px;
  margin-top: 10px;
  margin-bottom: 10px;
   color: rgb(31, 165, 243)
}
.btn {
  float: right;
}
.buttons > .el-button{
  width: 100px;
  float: left;
  height: 32px
}
.sousuojg6_10 {
  width: 100%;
  
}
</style>
